<!--
 * @Author: your name
 * @Date: 2020-09-24 14:29:55
 * @LastEditTime: 2020-09-24 16:04:41
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \inventory-apie:\hjimi\人脸\html\face-recognition\src\directive\loading\components\Loading.vue
-->
 
<template>
	<div v-show="visible" class="loading-wrap">
		<div class="loading-box"><div class="el-loading-spinner"><svg viewBox="25 25 50 50" class="circular"><circle cx="50" cy="50" r="20" fill="none" class="path"></circle></svg><!----></div></div>
	</div>
</template>

<script>
export default {
	data() {
		return {
			visible: true
		}
	}
}
</script>
<style lang="less" scoped>
.loading-wrap {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: hsla(0,0%,100%,.9);
	transition: all .4s;
}
.loading-box {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100px;
	transform: translate(-50%, -50%);
}
</style>